<template>
	<view style="height: 100vh; background-color: #FFFFFF;">
		<u-navbar title-color="#FFFFFF" height="48" back-icon-color="#FFFFFF" :border-bottom="false" :is-fixed="true" :title="'非紧急上报'"
		:customBack="back"></u-navbar>
		<view class="wrap">
			<u-form :model="warningForm" ref="warningForm" label-width="100px">
				<u-form-item label-position="left" label="异常内容" prop="name">
					<u-input  type="select" :select-open="contentShow" v-model="warningForm.name" placeholder="请选择异常内容" @click="contentShow=true"></u-input>
				</u-form-item>
				<u-form-item label-position="left" label="异常描述">
					<u-input type="textarea" :border="border" placeholder="请填写异常描述" v-model="warningForm.content" />
				</u-form-item>
			</u-form>
			<u-button @click="submit" type="primary" style="margin: 24rpx;">提交</u-button>
		</view>
		<u-select v-model="contentShow" mode="single-column" :list="list" @confirm="confirm"></u-select>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				contentShow:false,
				list:[
					{
						value: '1',
						label: '安全通道被阻塞'
					},
					{
						value: '2',
						label: '消防栓损坏'
					},
					{
						value: '3',
						label: '警报误触发自动报警'
					},
					{
						value: '4',
						label: '消防栓漏水'
					},
					{
						value: '5',
						label: '其他'
					}
				],
				warningForm:{},
				rules:{
					name: [
						// 对name字段进行必填验证
						{
							required: true,
							message: '请填写情况名称',
							trigger: ['blur','change']
						},
					],
					content: [
						// 对name字段进行必填验证
						{
							required: true,
							message: '请填写情况描述',
							trigger: ['blur']
						},
					],
				}
			}
		},
		onReady() {
			this.$refs.warningForm.setRules(this.rules);
		},
		onShow() {
			window.native.acceptUrl(res=>{
				if(res!=null){
					this.warningForm.reportedPic = res
				}
			})
		},
		methods: {
			back(){
				window.native.back()
			},
			confirm(e){
				e.map((val, index) => {
					this.warningForm.name = val.label
				})
			},
			submit(){
				this.$refs.warningForm.validate(valid => {
					if (valid) {
						this.utils.request("/api/app/handle/addInNonEmergency", this.warningForm, "post", "app", true).then(res => {
							console.log(`返回结果：`, res)
							this.back()
						}).catch(error => {
							console.log(error)
						})
					} else {
						console.log('验证失败');
					}
				});
			}
		}
	}
</script>

<style>

</style>
